(function () {
    let template = function (msg) {
        return `
<aux-view class="aup-coutdown">
    <aux-view class="content">${msg}</aux-view>
</aux-view>
        `;
    };
        
    (function () {

        function onClickTap(self) {
            return function (e) {
                e.stopPropagation();
                if (!self.$locked) {
                    self.$time = 60;
                    self.$locked = true;
                    self.$ele.root.auiAddOnceClass("locked");
                    self.$ele.content.innerHTML = sprintf(self.$format, {
                        value: self.$time
                    });
                    self.dispatchEvent(new CustomEvent("mystart", {
                        detail: {}
                    }));
                    self.$task = setInterval(function () {
                        self.$time = self.$time - 1;
                        if (self.$time > 0) {
                            self.$ele.content.innerHTML = sprintf(self.$format, {
                                value: self.$time
                            });
                        } else {
                            clearInterval(self.$task);
                            self.$task = -1;
                            self.$locked = false;
                            self.$ele.root.auiRemoveOnceClass("locked");
                            self.$ele.content.innerHTML = self.$default;
                            self.dispatchEvent(new CustomEvent("myend", {
                                detail: {}
                            }));
                        }
                    }, 1000);
                }
            }
        }

        return window.defineCustomElement(
            'aup-coutdown',
            {
                createdCallback: {value: function() {

                    }},
                attachedCallback: {value: function () {
                        let self = this;
                        self.$task = -1;
                        self.$ele = {};
                        self.$time = 60;
                        self.$locked = false;
                        self.$default = window.aui.getAttribute(self, "msg", "msg");
                        self.$format = window.aui.getAttribute(self, "format", "@{value}秒重新获取");
                        self.innerHTML = template(self.$default);
                        self.$ele.root = window.AuifindSelector(self, "> .aup-coutdown");
                        self.$ele.content = self.$ele.root.children[0];
                        self.$onClicked = onClickTap(self);
                        self.$ele.root.addEventListener("click",  self.$onClicked)
                    }},
                attributeChangedCallback: {value: function (name, oldval, newval) {
                        // console.log(name + ":" + oldval + "," + newval);
                        let self = this;
                        if (name === "format") {
                            self.$format = newval;
                        }
                    }}
            }
        );

    }());

    document.createElement('aup-coutdown');
})();


